<template>
	<view>
	<view class="container" v-if="info">
		<uni-card class="m-t20 fs14" title="基本信息" :extra="serviceState[info.sState]" :isShadow="false">
			<view class="p-b20">工地：{{ info.DecorationFullAddress || "" }}</view>
			<view class="p-b20">手机号：{{info.MobileTelephone || ""}}</view>
			<view class="p-b20">户型：{{ info.HouseType || "" }}</view>
			<view class="p-b20">面积：{{ info.Area || 0 }}㎡</view>
			<!-- <view class="p-b20">合同号：{{info.ContractDh || ""}}</view> -->
		</uni-card>
		<uni-card class="m-t20 fs14" title="阶段进度" :isShadow="false" v-if="false">
			<view v-for="(item,key) in projects" :class="(key > 0 ? 'border-t1' : '')+' p-t20 p-b20'">
				<view class="p-b10">{{ item.ConstructionProjectName }}</view>
				<view class="uni-flex justify-space-between fs12">
					<view class="text-gray6">{{getDateFormat(item.PBegDate) + '~' + getDateFormat(item.PEndDate)}}
					</view>
					<view :class="item.PState == 4 ? 'text-blue' : (item.PState == 5 ? 'text-red' : '')">
						{{ projectState[item.PState] }}</view>
				</view>
			</view>
		</uni-card>
		<uni-card class="m-t20 fs14" title="人员信息" :isShadow="false">
			<view class="p-b20">项目经理：{{info.WorkerPrincipal || ""}}</view>
			<view class="p-b20">工程监理：{{info.Supervisor || ""}}</view>
			<view class="p-b20">设计师：{{info.MarketingManager || ""}}</view>
			<view class="p-b20">总裁直达号：{{ president_phone }}</view>
		</uni-card>
		<uni-card class="m-t20 fs14" title="费用(元)" :isShadow="false">
			<view class="p-b20">合同金额：<text class="text-red">{{info.ContractInfo.ContractAmount || "0.00"}}元</text>
			</view>
			<view class="p-b20">已交定金：<text class="text-red">{{ info.commInfo.d01 }}元</text></view>
			<view class="p-b20">已交首期款：<text class="text-red">{{ info.commInfo.s01 }}元</text></view>
			<view class="p-b20">已交二期款：<text class="text-red">{{ info.commInfo.s02 }}元</text></view>
			<view class="p-b20" v-if="info.commInfo.s03 > 0">已交三期款：<text
					class="text-red">{{ info.commInfo.s03 }}元</text></view>
			<view class="p-b20">已交尾期款：<text class="text-red">{{ info.commInfo.s04 }}元</text></view>
		</uni-card>
		<uni-card class="m-t20 fs14" title="工地日报" :isShadow="false">
			<view class="log_tab_0 bg-white">
				<view class="p-b30" v-if="logList.length == 0">
					<noempty></noempty>
				</view>
				<view class="log_list fs12 p-b30" v-else>
					<view v-for="item in logList" class="log_item">
						<view class="log_time p-t30 p-b30 uni-flex justify-left">
							<uni-icons type="circle-filled" size="18" color="#007AFF"></uni-icons>
							<view class="log_time_text p-l10">{{ item.start_date }}</view>
						</view>
						<view class="log_cont fs12 p-l30">
							<!-- <view class="log_title border-b1 fs14 p-b20">{{ item.user_name }}</view> -->
							<view class="m-t20">工地日报</view>
							<view class="text-gray9 m-t30 m-b30 ">{{ item.content }}</view>
							<view class="log_imgs w-100">
								<image class="w-100n h-100n m-r10 m-b10" v-for="(img,ikey) in item.Images" :src="img"
									mode="aspectFill" @click="viewImage(item.Images, ikey)"></image>
							</view>
						</view>
					</view>
				</view>
			</view>
		</uni-card>
	</view>
	
	<view class="pos-bottom uni-flex justify-space-around bg-white border-t1 p-t20 p-b30 w-full">
		<view class="btn_small_org m-r10 m-l10" @click="goPage('video', info.ThirdPartyCoding)"
			v-if="info.is_live!=100"> 直播 </view>
		<view class="btn_small_green m-r10" @click="goPage('design', info.Vr_Url)" v-if="info.Vr_Url"> VR图 </view>
		<view class="btn_small_green m-r10" @click="goPage('design', info.D3_Url)" v-if="info.D3_Url"> 3D图 </view>
		<view class="btn_small m-r10" @click="goPage('comment', info.customerno)" v-if="info.sState==3"> 评价 </view>
	</view>
	</view>
</template>
<script>
	import {
		getSystemConfig
	} from "@/api/base.js"
	import {
		getCrmServiceInfo
	} from "@/api/project.js"
	import moment from 'moment'
	let that;
	export default {
		data() {
			return {
				customerno: "",
				info: {}, //工地详情
				serviceState: ['待开工', '在建', '在建', '已完工'],
				projectState: ['', '已排期', '进行中', '进行中', '已完成', '已超期'],
				projects: [], //阶段
				president_phone: "",
				logList: [], //工地日报
			}
		},
		onLoad(e) {
			that = this
			that.customerno = e.customerno ? e.customerno : ""
			if (that.customerno) {
				that.getDetail()
			}
			that.getSystemPhone()
		},
		methods: {
			getSystemPhone() {
				getSystemConfig({
					condition: {
						code: 'president_phone',
						state: 1
					}
				}).then(res => {
					that.president_phone = res.data ? res.data[0]['value'] : ''
				})
			},
			getDateFormat(date) {
				return date ? date.split(" ")[0] : "--";
			},
			getDetail() {
				let that = this;
				getCrmServiceInfo({
					CustomerNo: that.customerno,
					from: 'weminicut'
				}).then((res) => {
					that.info = res.data.detail
					that.projects = res.data.projects
					that.logList = res.data.logs
				})
			},
			// 开票
			goPage(type, content) {
				if (content == "") {
					uni.showToast({
						title: '工地信息异常，请联系我们',
						icon: 'none'
					})
					return;
				}
				if (type == "approve") { //开票
					uni.navigateTo({
						url: `/pages/apply/index?Sub_dh=${content}`
					})
				} else if (type == "video") { //查看现场				
					uni.navigateTo({
						url: `/pages/index/device?sCrm_v2=${content}`
					})
				} else if (type == "comment") { //评价				
					uni.navigateTo({
						url: `/pages/index/comment?Sub_dh=${content}`
					})
				} else if (type == "design") { //效果图		
					uni.navigateTo({
						url: `/pages/index/design?url=${encodeURIComponent(content)}`
					})
				}
			},
			/**
			 * 查看大图
			 */
			viewImage(imgs, index) {
				uni.previewImage({
					current: index,
					urls: imgs
				})
			}
		}
	}
</script>
<style>
	.uni-table {
		width: 100% !important;
		min-width: 100% !important;
	}

	.uni-table-th,
	.uni-table-td {
		text-align: center !important;
		padding: 10rpx !important;
	}

	.item_title {
		border-left: 9rpx solid #4170F2;
		text-indent: 20rpx;
	}

	.uni-forms-item {
		margin-bottom: 40rpx !important;
	}

	.img_item {
		width: 120rpx;
		height: 120rpx;
	}

	.imgs {
		width: 100%;
	}

	.editInfoBtn {
		position: fixed;
		height: 37px;
		line-height: 37px;
		background-color: #4170F2;
		color: #fff;
		border-radius: 40px;
		text-align: center;
		font-size: 15px;
		width: 90vw;
		left: 5vw;
		bottom: 30px;
	}

	.uni-table-th,
	.uni-table-td {
		font-size: 12px !important;
	}
</style>